<template>
  <!-- 问题信息 -->
  <a-card :bordered="false"
    :style="editModel == 3 || form.status === 'QUALIFIED' || form.status === 'UNQUALIFIED' ? '' : 'margin-bottom:50px'">
    <title-name title="问题信息"></title-name>
    <a-button v-if="!onlyRead && editModel != 4" class="mb12" type="primary" @click="handleManage('U')"
      icon="plus">添加问题</a-button>
    <a-button v-if="editModel == 4" class="mb12" type="primary" @click="handleCite" icon="tag" :disabled="!form.projectId">引用问题信息</a-button>
    <!-- 表格 -->
    <a-table rowKey="sort" bordered ref="table" :columns="columns" :scroll="{ x: 2500 }" :dataSource="form.checks"
      :pagination="false">
      <template slot="rectifierCompanyName" slot-scope="text, record, index">
         {{setRectifierCompanyName(record)}}
      </template>
      <template slot="action" slot-scope="text, record, index">
        <a v-if="onlyRead" @click="handleView(record)">查看</a>
        <template v-else>
           <!-- 生成整改单时只显示删除 -->
          <a class="del_btn" @click="handleRemove(index)">删除</a>
         <a-dropdown style="margin-left:10px" v-if="editModel != 4">
              <a class="ant-dropdown-link">
                更多 <a-icon type="down" />
              </a>
              <a-menu slot="overlay">
                <a-menu-item>
                 <a v-if="editModel != 4" @click="handleManage('E', record,form.checks,index)">编辑</a>
                </a-menu-item>
                <a-menu-item>
                 <a v-if="editModel != 4" @click="handleCopy(record)">自动新增</a>
                </a-menu-item>
              </a-menu>
            </a-dropdown>
        </template>
      </template>
      <l-table slot="fileArrays" uploadType="image" editModel="V" slot-scope="text" :upload-arrys="text" isUploadImgAndVideo
        :disabled="true" />
    </a-table>
    <!-- 添加问题弹窗 -->
    <DialogProblem ref="dialogEditModel" :headerTitle="{ U: '添加', E: '编辑' }[dialogEditModel] + '问题'"
      :dialogEditModel="dialogEditModel" @confirm="handleConfirm" :dialogForm="dialogForm" :postData="postData" />
    <!-- 引用问题信息弹窗 -->
    <DialogCite ref="dialogCiteModel" headerTitle="引用问题信息"
      :selectedIds="form.checks && form.checks.length ? form.checks.map((i) => i.id) : []" @handleConfirm="handleAdd"
      :form="form" />
  </a-card>
</template>

<script>
import MoreButton from '@/components/MoreButton' // 多按钮容器
import DialogProblem from './DialogProblem' // 添加问题弹窗
import DialogCite from './DialogCite' // 引用问题信息弹窗
const columnsTwo = [
  {
    title: '序号',
    dataIndex: 'sort',
    width: 70,
    align: 'center'
  },
  {
    title: '检查类别',
    // ellipsis: true,
    dataIndex: 'checkTypeName'
  },
  {
    title: '分部分项',
    // ellipsis: true,
    dataIndex: 'subProjectName'
  },
  {
    title: '检查区域',
    // ellipsis: true,
    dataIndex: 'respAreaName'
  },
  {
    title: '检查部位',
    // ellipsis: true,
    dataIndex: 'checkDescribe'
  },
  {
    title: '影像资料',
    dataIndex: 'fileArrays',
    scopedSlots: { customRender: 'fileArrays' }
  },
  {
    title: '问题描述',
    // ellipsis: true,
    dataIndex: 'problemTypeName'
  },
  {
    title: '问题补充',
    // ellipsis: true,
    dataIndex: 'description'
  },
  {
    title: '整改单位',
    // ellipsis: true,
    dataIndex: 'rectifierCompanyName',
    scopedSlots: { customRender: 'rectifierCompanyName' }
  },
  {
    title: '责任人',
    dataIndex: 'dutyName'
  },
  {
    title: '整改人',
    dataIndex: 'rectifierName'
  },
  {
    title: '操作',
    dataIndex: 'action',
    width: '180px',
    // fixed: 'right',
    align: 'center',
    scopedSlots: { customRender: 'action' }
  }
]
const columns = [
  {
    title: '序号',
    dataIndex: 'sort',
    width: 70,
    align: 'center'
  },
  {
    title: '检查类别',
    // ellipsis: true,
    dataIndex: 'checkTypeName'
  },
  {
    title: '分部分项',
    // ellipsis: true,
    dataIndex: 'subProjectName'
  },
  {
    title: '检查区域',
    // ellipsis: true,
    dataIndex: 'respAreaName'
  },
  // {
  //   title: '检查部位',
  //   // ellipsis: true,
  //   dataIndex: 'checkDescribe'
  // },
  {
    title: '影像资料',
    dataIndex: 'fileArrays',
    scopedSlots: { customRender: 'fileArrays' }
  },
  {
    title: '问题描述',
    // ellipsis: true,
    dataIndex: 'problemTypeName'
  },
  {
    title: '问题补充',
    // ellipsis: true,
    dataIndex: 'description'
  },
  {
    title: '整改单位',
    // ellipsis: true,
    dataIndex: 'rectifierCompanyName',
     scopedSlots: { customRender: 'rectifierCompanyName' }
  },
  // {
  //   title: '整改描述',
  //   // ellipsis: true,
  //   dataIndex: 'rectifyDescription'
  // },
  {
    title: '操作',
    dataIndex: 'action',
    width: '180px',
    // fixed: 'right',
    align: 'center',
    scopedSlots: { customRender: 'action' }
  }
]
export default {
  name: 'a' + Date.now(),
  components: {
    MoreButton,
    DialogProblem,
    DialogCite
  },
  props: {
    // 表单
    form: {
      type: Object,
      default: () => ({})
    },
    // 只读模式
    onlyRead: {
      type: Boolean,
      default: () => false
    },
    // 操作类型：0 新增，1 编辑，2 查看，3 验证，4 生成整改单
    editModel: {
      type: [String, Number],
      default: () => '0'
    },
    //选中的受检单位岗位信息
    postData: {
      type: Object,
      default: () => { }
    }
  },
  data() {
    // this.columns = columns // 问题信息表格表头
    return {
      dialogEditModel: 'U', // 弹窗操作类型：U 新增；E 编辑
      dialogForm: {
      }, //弹窗表单
      columns: [],
    }
  },
  computed: {
    // columns() {
    //   if (this.editModel === 2) {
    //     const arr = [...columns]
    //     const last = arr.pop()
    //     return [
    //       ...arr,
    //       {
    //         title: '整改描述',
    //         dataIndex: 'problem.rectifyDescription'
    //       },
    //       {
    //         title: '整改照片',
    //         dataIndex: 'problem.rectifyFileArrays',
    //         scopedSlots: { customRender: 'fileArrays' }
    //       },
    //       {
    //         title: '整改状态',
    //         dataIndex: 'problem.rectifyStatusName'
    //       },
    //       last
    //     ]
    //   } else {
    //     return columnsTwo
    //   }
    // }
  },
  mounted() {
    if (this.editModel * 1 === 2 || this.editModel * 1 === 3) {
      const arr = [...columns]
      const last = arr.pop();
      this.columns = [...arr,
      {
        title: '整改描述',
        dataIndex: 'problem.rectifyDescription'
      },
      {
        title: '整改照片',
        dataIndex: 'problem.rectifyFileArrays',
        scopedSlots: { customRender: 'fileArrays' }
      },
      {
        title: '整改状态',
        dataIndex: 'problem.rectifyStatusName'
      },
        last]
    } else {
      this.columns = columnsTwo;
    }
  },
  methods: {
    //设置整改单位
    setRectifierCompanyName(data){
      let name = '';
      if(data.checkTypeName=='工程资料' || data.checkTypeName=='管理行为'){
         name = data?.inspectedUnitName || this.form.inspectedUnitName;
      }else{
        name = data?.rectifierCompanyName
      }
      return name;
    },
    /**
     * @description: 查看问题详情
     * @param {*} record：业务对象
     */
    handleView(record) {
      this.$router.push({
        name: 'proejctProblemRecordInfo',
        query: {
          id: record?.problem?.id,
          manageType: '1',
          combine: true
        }
      })
    },
    /**
     * @description:
     * @param {*} type：操作类型： U 新增；E 编辑
     * @param {*} record：业务对象
     */
    handleManage(type, record,data,index) {
      if (!this.form.inspectedUnitId) {
        this.$message.warning('请先选择受检单位')
        return
      }
      if (!this.form.rectifyTerm) {
        this.$message.warning('请先选择整改期限！')
        return
      }
      this.dialogEditModel = type
      this.dialogForm = { projectId: this.form.projectId, inspectedUnitId: this.form.inspectedUnitId, rectifyTerm: this.form.rectifyTerm } || {
        coordinate: [],
        problem: {},
        projectId: this.form.projectId,
        inspectedUnitId: this.form.inspectedUnitId,
      }
      if(data){   //解决点击编辑按钮table 缓存问题
        let rowDta = data[index];
        this.dialogForm = {...this.dialogForm ,...rowDta};

      }else{
          this.dialogForm = {... this.dialogForm,...record}
          //this.dialogForm.projectTypeId = null;
      }
      this.dialogForm.inspectedUnitName = this.form.inspectedUnitName;
      this.dialogForm.tageCode = this.form.tageCode;
      this.dialogForm.newRespAreaId = record?.respAreaId;
      this.$refs.dialogEditModel.visible = true
    },
    /**
     * @description:引用问题
     */
    handleCite() {
      if (!this.form.inspectedUnitId) {
        // 项目id来自于受检单位项目部的选择
        this.$message.warning('请先选择受检单位')
        return
      }
      this.$refs.dialogCiteModel.visible = true
    },
    /**
     * @description: 操作表单到表格
     * @param {*} form：表单
     */
    handleConfirm(form) {
      // 新增操作
      if (this.dialogEditModel === 'U') {
        form.sort = this.form.checks.length + 1
        this.form.checks.push(form)
      } else {
        //编辑
        // 有sort说明是前端数据，有id则为后端数据
        if (form.sort) {
          this.form.checks.splice(form.sort - 1, 1, form)
        } else if (form.id) {
          let sort = this.form.checks.findIndex((i) => i.id === form.id)
          this.form.checks.splice(sort - 1, 1, form)
        }
      }
      // 框架bug，表格右侧操作列固定右侧，高度不会随同行高度自适应，需要手动更新
      this.$forceUpdate()
      this.$refs.dialogEditModel.visible = false;
    },
    /**
     * @description: 框架bug，表格右侧操作列固定右侧，高度不会随同行高度自适应，需要手动更新
     * @return {*}
     */
    // refreshTable() {
    //   setTimeout(() => {
    //     this.$forceUpdate()
    //   }, 500)
    // },
    /**
     * @description: 引用数据到问题列表
     * @param {*} list：需要添加的列表
     */
    handleAdd(list) {
      // 新增操作
      this.form.checks = this.form.checks.concat(
        list.map((i, num) => {
          i.sort = this.form.checks.length + num + 1
          return i
        })
      )
      // 框架bug，表格右侧操作列固定右侧，高度不会随同行高度自适应，需要手动更新
      this.$forceUpdate()
      this.$refs.dialogCiteModel.visible = false
    },
    /**
     * @description: 删除问题信息
     * @param {*} index：索引值
     */
    handleRemove(index) {
        console.log(index,111)
      this.$confirm({
        title: '提示',
        content: '确认删除？',
        onOk: () => {
          this.form.checks.splice(index, 1)
        }
      })
    },
    /**
     * @description: 自动新增
     * @param {*} record：业务对象
     * @return {*}
     */
    handleCopy(record) {
      let newRecord = this.$clone(record)
      // 增加序号
      newRecord.sort = this.form.checks.length + 1
      this.form.checks.push(newRecord)
      // 框架bug，表格右侧操作列固定右侧，高度不会随同行高度自适应，需要手动更新
      this.$forceUpdate()
    }
  }
}
</script>